<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>套账查看</title>
<script type="text/javascript" src="static/easyui/jquery.min.js"></script>
<script type="text/javascript" src="static/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="static/easyui/locale/easyui-lang-zh_CN.js"></script>
<link rel="stylesheet" href="static/easyui/themes/icon.css">
<link rel="stylesheet" href="static/easyui/themes/metro-blue/easyui.css">
</head>
<body>
<style type="text/css">
	*{
			margin:0px;
			padding:0px;
	}
	.background{
		width: 1120px;
	    height: 570px;
	    margin: 0px auto;
	    margin-top: 10px;
	    background-color: #FFF;
	}
	.notice-head{
		width: 1070px;
	    height: 45px;
	    border-bottom: 1px solid #F3F3F9;
	    color: #19AA9A;
	    font-size: 18px;
	    text-align: center;
	    line-height: 45px;
	    font-weight: 700;
	    margin: 0px auto;
	}
	.bianji-center{
		width: 990px;
	    height: 250px;
	    margin-left: 60px;
	}
	.textbox{
		height: 26px;
	    border: 1px solid #CCCCCC;
	    margin-left: -6px;
	}
	.quxiao{
		width: 70px;
	    height: 25px;
	    border-radius: 4px;
	    color: #19AA8D;
	    background-color: #fff;
	    border: 1px solid #19AA8D;
	    position: fixed;
	    top: 570px;
    	left: 660px;
	}
	.queding{
		width: 70px;
	    height: 25px;
	    border-radius: 4px;
	    color: #fff;
	    background-color: #19AA8D;
	    border: 1px solid #fff;
	    position: fixed;
	    top: 570px;
	    font-size:12px;
    	left: 750px;
    	line-height:25px;
    	text-align:center;
    	cursor: pointer;
	}
	.text1{
		margin-right: 40px;
		font-size: 14px;
    	font-weight: 700;
    	background-color: #fff;
	}
	#name{
		width: 150px;
	    height: 24px;
	    border: 1px solid #fff;
	    margin-left: -40px;
	    background-color:#fff;
	    font-size: 14px;
    	font-weight: 700;
	}
	.text2{
		margin-left: 185px;
		font-size: 14px;
    	font-weight: 700;
	}
	#salary{
		width: 150px;
	    height: 24px;
	    background-color:#fff;
	    border: 1px solid #fff;
	    font-size: 14px;
    	font-weight: 700;
	}
	.text3{
		margin-right: 40px;
	    font-size: 14px;
	    font-weight: 700;
	    margin-left: 100px;
	}
	#date{
		width: 150px;
	    height: 24px;
	    border: 1px solid #fff;
	    margin-left: -40px;
	    background-color:#fff;
	    font-size: 14px;
    	font-weight: 700;
	}
	.text4{
		margin-left: 14px;
		font-size: 14px;
    	font-weight: 700;
	}
	#preson{
		width: 150px;
	    height: 24px;
	    border: 1px solid #fff;
	    margin-bottom:20px;
	    background-color:#fff;
	    font-size: 14px;
    	font-weight: 700;
	}
	.text5{
		margin-left: 185px;
		font-size: 14px;
    	font-weight: 700;
	}
	#beizhu{
		width: 150px;
	    height: 24px;
	    border-radius: 4px;
	    border: 1px solid #fff;
	    margin-bottom: 20px;
	    font-size: 14px;
    	font-weight: 700;
	}
	.text6{
		margin-left: 111px;
		font-size: 14px;
    	font-weight: 700;
	}
	#tzrys{
		width: 167px;
	    height: 24px;
	    border: 1px solid #fff;
	    background-color:#fff;
	    font-size: 14px;
    	font-weight: 700;
	}
	.text7{
		font-size: 14px;
    	font-weight: 700;
	}
	#tzry{
		width: 336px;
	    height: 24px;
	    border-radius: 4px;
	    border: 1px solid #fff;
	    margin-bottom: 20px;
	    background-color: #fff;
	    font-size: 14px;
    	font-weight: 700;
	}
	.text8{
		font-size: 14px;
    	font-weight: 700;
    	margin-left: 28px;
	}
	#remarks{
	   width: 429px;
	   height: 24px;
	   background-color: #fff;
	   border: 1px solid #fff;
	   font-size: 14px;
       font-weight: 700;
	    
	}
	.table{
		width: 1000px;
		margin:0px auto;
		margin-top:20px;
		border: 1px solid #E5E5E5;		
	}
	.datagrid-header .datagrid-cell span{
		color: #19AA9A;
	    font-size: 14px;
	    font-weight: 700;
	}
	.datagrid-header .datagrid-cell,.datagrid-cell, .datagrid-cell-group, .datagrid-header-rownumber, .datagrid-cell-rownumber {
		text-align: center;
	}
	.table .datagrid .panel-body{
	 	width: 1017px;
	}
	.datagrid-header{
		height:39px;
	}
	.datagrid-header-row, .datagrid-row {
   	 	height: 40px;
	}
	.fanhui{
		width: 75px;
	    height: 30px;
	    border: 1px solid #fff;
	    background-color: #18A689;
	    border-radius: 4px;
	    color: #fff;
	    margin-top: 10px;
	    margin-left: 530px;
	}
	.emp_add_div{
		width: 1000px;
	    height: 25px;
	    margin: 0px auto;
	    margin-top: -75px;
	}
	.xinzeng{
		background: #FFB667;
	    border-radius: 3px;
	    color: white;
	    float: right;
	    width: 75px;
	    height: 27px;
	    border: none;
	    outline: none;
	    cursor: pointer;
	}
	.table-title .textbox{
	    margin-top: -25px;
	}
	.formdiv{
		width: 990px;
	    margin-bottom: 20px;
	    height: 40px;
	    margin-top: 5px;
	}
	.win-queding{
		background-color:#fff;
		border:1px solid #17AA8D;
	    border-radius: 3px;
	    color: #17AA8D;
	    margin: 40px 155px;
	    width: 60px;
	    height: 25px;
	    cursor: pointer;
	    text-align: center;
	    line-height: 25px;
	}
	.guanbi{
		border:1px solid #d9534f;
		background-color:#fff;
		border-radius:3px;
		color:#d9534f;
		width:60px;
		height:25px;
		cursor:pointer;
		text-align: center;
	    line-height: 25px;
	    margin-top: -67px;
    	margin-left: 239px;
	}
	.pay-div{
		margin-top: 20px;
    	margin-left: 30px;
	}
	.pay-input1{
		border: 1px solid #ccc;
    	height: 22px;
    	width: 200px;
	}
	.pay-div .textbox{
		margin-left:0px;
	}
	.pay-text2{
		position: relative;
    	top: -8px;
	}
</style>
<script type="text/javascript">
	function add(text){
		$("#content-admin").panel({
			href:text
		});
	}
	function fanhui(){
		add("salary-emp");
	}
	$(function(){
		var a_id=$("#ssid").val();
		$("#table_account").datagrid({
			url:'account-table?account_id='+a_id,
			singleSelect:true,			
			columns:[[{field:'xuhao',title:'序号',width:100},
					{field:'items_name',title:'项目名称',width:270},
	           		{field:'si_money',title:'项目总金额',width:228},
	           		{field:'si_remarks',title:'项目说明',width:400}
            ]]
		});
		$("#table_account").datagrid({
			//rowData是当前选中行的数据，是json字符串格式
			onClickRow:function(rowIndex,rowData){
				console.log(rowData);
				$("#account_id").val(rowData["account_id"]);
				
			}
		});	
	});
	function additems(){
		$("#pay-form").form("clear");
		$('#win_1_1').window('open');
	}
	function guanbi(){
		$('#win_1_1').window('close');
	}
	//新增项目
	function xzitemsqd(){
		var account_id=$("#ssid").val();
		var items_name=$("#itemsnames").val();
		var items_money=$("#items_money").val();
		var items_sm=$("#items_sm").val();
		if(account_id==0||account_id==null){
			return false;
		}else if(items_name==""||items_name==null){
			alert("请输入项目名称");
			return false;
		}else if(items_money==0||items_money==null){
			alert("请输入基本工资");
			return false;
		}else if(items_sm==""||items_sm==null){
			alert("请输入项目说明");
			return false;
		}else{
			$.ajax({
				url:"xzitemss",
				type:"post",
				data:{"items_name":items_name,"items_money":items_money,"si_remarks":items_sm,"account_id":account_id},
				success:function(result) {
					alert("项目新增成功");
					$('#win_1_1').window('close');
					$("#content-admin").panel('open').panel('refresh','salary-emp-add?account_id='+result);
	            }
			})
		}
	}
</script>
	<div class="background">
			<div class="notice-head">套账查看</div>
			<div class="bianji-center">
					<form id="form" method="post">
						<div class="formdiv">
							<input type="hidden" id="ssid" name="account_id" value="${pojos.account_id }">
							<span class="text1"><span style="color:red">*</span>套账名称：</span>
							<input type="text" id="name" name="account_name" value="${pojos.account_name }" disabled="disabled">
							<span class="text2"><span style="color:red">*</span>薪资等级：</span>
							<input type="text" id="salary" name="sa_dass" value="${pojos.sa_dass }" disabled="disabled">
						 	<span class="text3"><span style="color:red">*</span>创建日期：</span>
						 	<fmt:formatDate type='both' var='kai' value='${pojos.sa_date}' />
							<input id="date" disabled="disabled" type="text" name="sa_date"  value="${kai}" disabled="disabled">
						</div>
						<div class="formdiv">
							<span class="text4"><span style="color:red">*</span>创建人：</span>
							<input type="hidden" name="staff_id" value="${pojos.Staff_name }">						
							<input type="text" id="preson"  name="Staffss_name" value="${pojos.staff_name1 }" disabled="disabled">
							<span class="text5"><span style="color:red">*</span>基本工资：</span>
							<input type="text" id="tzrys"  name="Staffs_name" value="${pojos.sa_base }" disabled="disabled">
						</div>
						<div class="formdiv">
							<span class="text7"><span style="color:red">*</span>套账人员：</span>
							<input type="text" id="tzry" name="${str}" value="${str }" disabled="disabled">
							<span class="text8"><span style="color:red">*</span>备注：</span>
							<input type="text"id="remarks" disabled="disabled" value="${pojos.sa_remarks }">
						</div>
						
					</form>
			</div>
			<div class="emp_add_div"><button class="xinzeng" onclick="additems()">新增</button></div>
			<div class="table">
				<input type='hidden' id='account_id' >
				<table id="table_account" class="easyui-datagrid" style="width:998px;height:250px"></table>
			</div>
			<button class="fanhui" onclick="fanhui()">返回</button>
			
			<div id="win_1_1" class="easyui-window" title="新增项目" style="width:450px;height:250px;" 
			    data-options="iconCls:'icon-save',modal:true,closed:true">
			    <form id="pay-form">
			    	<div class="pay-div">
			    		<span class="pay-text1"><span style="color:red">*</span>项目名称:</span>
			    		<input type="text" class="pay-input1" id="itemsnames">
			    	</div>
			    	<div class="pay-div">
			    		<span class="pay-text1"><span style="color:red">*</span>项目金额:</span>
			    		<input type="text" class="easyui-numberbox pay-input1" value="100" data-options="min:0,precision:2" id="items_money">
			    	</div>
			    	<div class="pay-div">
			    		<span class="pay-text2"><span style="color:red">*</span>项目说明:</span>
			    		<textarea rows="20" cols="5" style="height:25px;border:1px solid #ccc;width:280px;" id="items_sm"></textarea>
			    	</div>
			    	<div class="win-queding" onclick="xzitemsqd()">确定</div><div class="guanbi" onclick="guanbi()">取消</div>
			    </form>
			</div>
</div>
</body>
</html>
	
	